<template>
	<view class="content">
		<view class="itemlist">
			<view class="item-A" @click="goToPage('/pages/index/gongdi/details/details?id='+item.id)"
				v-for="(item,index) in list" :key="index">
				<image class="item-img" :src="item.thumb" mode=""></image>
				<view class="item-mark">
					<view class="item-desc">{{item.name}}</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				pageData: {
					page: 1,
					limit: 10
				}

			};

		},
		methods: {
			goToPage(path) {
				uni.navigateTo({
					url: path
				})
			},
			getList() {

				this.$http.post('/system/getConstructionList', this.pageData).then(res => {

					this.list = [...this.list, ...res.data.data.list]
				})

			}
		},
		onLoad() {
			this.getList()

		},
		onReachBottom() {
			console.log("已触底");
			this.pageData.page += 1
			console.log(this.pageData.page);
			this.getList()
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		.itemlist {
			margin: 40rpx;

			.item-A {
				margin-bottom: 40rpx;

				.item-img {
					width: 670rpx;
					height: 406rpx;
				}

				.item-mark {
					margin-top: -10rpx;
					width: 670rpx;
					height: 74rpx;
					background: #ffffff;
					border-radius: 0rpx 0rpx 12rpx 12rpx;
					box-shadow: 0rpx 4rpx 4rpx 0rpx rgba(0, 0, 0, 0.10);
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					margin-bottom: 40rpx;

					.item-desc {

						font-size: 24rpx;
						font-family: PingFang SC, PingFang SC-Bold;
						font-weight: 700;
						color: #333333;
						line-height: 24rpx;
						display: flex;
						justify-content: center;
					}
				}
			}
		}

	}
</style>